<template>
  <basePage :show-tabbar="false" :page-params="pageParams">
    <view class="list-bg">
      <view class="pop-title">
        <view class="title">发货方式</view>
        <view
          class="close"
          @click="closePopFn"
        >
          <image
            class="close-icon"
            src="/static/image/close.png"
          />
        </view>
      </view>
      <view class="pop-content">
        <u-radio-group
          v-model="curOrderInfo.sendType"
          :icon-placement="'right'"
          placement="column"
          :border-bottom="true"
        >
          <view v-for="(item,index) in curOrderInfo.sendTypeList" :key="index" class="radio-item">
            <u-radio
              active-color="#FF5533"
              label-color="#222"
              size="14"
              :label="item.sendTypeText"
              :name="item.sendType"
              :custom-style="radioCustomStyle"
            />
          </view>
        </u-radio-group>
        <view class="btn-box">
          <button class="btn confirm-btn" :plain="true" @click="confirmFn">确定</button>
        </view>
      </view>
    </view>
  </basePage>
</template>

<script>
import basePage from '@/components/base-page';
export default {
  components: {
    basePage
  },
  props: {
    orderInfo: {
      type: Object,
      default: null
    },
  },
  data() {
    return {
      title: 'Index',
      pageParams: {
        // state: 'ERROR',
        emptyTitle: '信号可能跑到外星球了哦～',
        errorTitle: '请求失败',
        showButton: true
      },
      radioCustomStyle: { width: '678rpx', height: '98rpx', },
      oldData: {},
    }
  },
  computed: {
    curOrderInfo() {
      return this.orderInfo
    }
  },
  mounted() {
    this.oldData = { ...this.curOrderInfo }
  },
  methods: {
    confirmFn() {
      this.curOrderInfo.sendTypeList.forEach((item) => {
        if (this.curOrderInfo.sendType == item.sendType) {
          this.curOrderInfo.sendTypeText = item.sendTypeText
        }
      })
      this.$emit('update:orderInfo', this.curOrderInfo)
      this.close()
    },
    close() {
      this.$emit('closePopFn')
    },
    closePopFn() {
      this.$emit('update:orderInfo', this.oldData)
      this.close()
    }
  }
}
</script>

<style scoped lang="scss">
@import "../static/scss/index";
.list-bg{
  height: 500rpx;
  .pop-content{
    .radio-item{
      width: 678rpx;
      height: 98rpx;
      border-bottom: 2rpx solid $uni-f5bg-color;
    }
  }
}
</style>
